<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>

<%
	request.setAttribute("title","文章详情");
    request.setAttribute("modelConfigPath", "official");
%>

<%@ include file="/WEB-INF/views/shared/master/contentHeader.jsp"%>
<style type="text/css">
 .content{
     margin-bottom: 28px;
  }
</style>

<t:panel cssClass="panel-flat form-detailed" customBody="true" customHead="true">
    <div class="detailed-navbar-content panel-body content">
        <t:form commandName="artical" action="/admin/official/artical/save" method="post" cssClass="form-horizontal">
            <div class="hide">
                <t:hidden path="id"/>
                <t:hidden path="createTime"/>
                <t:input type="hidden" path="imgUrl" />
                <t:input type="hidden" path="videoUrl" />
                <t:input type="hidden" path="fileUrl" />
            </div>
            <t:formgroup>
                <t:label path="title" cssClass="col-sm-2" />
                <t:input path="title" colClass="col-sm-10" />
                
            </t:formgroup>
             <t:formgroup>
                <t:label path="typeId" cssClass="col-sm-2" />
                <t:treelist path="typeId" colClass="col-sm-4" />
                <t:label path="importantType" cssClass="col-sm-2" />
                <t:select2 path="importantType" colClass="col-sm-4" />
            </t:formgroup>
            <t:formgroup>
            	 <t:label path="display" cssClass="col-sm-2" />
                <t:switch path="display" colClass="col-sm-4" offColor="primary" onColor="danger" />
          		  <t:label path="author" cssClass="col-sm-2" />
                <t:input path="author" colClass="col-sm-4" />
            </t:formgroup>
            <t:formgroup>
                <t:label path="email" cssClass="col-sm-2" />
                <t:input path="email" colClass="col-sm-4" />
                <t:label path="keyword" cssClass="col-sm-2" />
                <t:input path="keyword" colClass="col-sm-4" />
            </t:formgroup> 
            <t:formgroup>
                <t:label path="href" cssClass="col-sm-2" />
                <t:input path="href" colClass="col-sm-4" />
                <label for="courseVideo" class="col-sm-2 control-label cursor-pointer text-right">视频</label> 
                <div class="col-sm-4">
                	<input type="text" id="courseVideo" value="${tfn:getFileName(artical.videoUrl)}" class="form-control custom-input " />
                </div>
            </t:formgroup>  
            <t:formgroup>
            <div class="col-sm-6">
                <t:label path="imgUrl" cssClass="col-sm-4" /> 
                <div class="col-sm-4">  
               		<c:if test="${artical.imgUrl!=null && artical.imgUrl!=''}">
					    <img style="width:100px; height:80px;" id="smallPicShow" src="${tfn:getFileUrl(artical.imgUrl)}" /> 
				    </c:if>
				    <c:if test="${artical.imgUrl ==null || artical.imgUrl==''}">
						 <img style="width:100px; height:80px;" id="smallPicShow" src="<c:url value='/images/we/invitationIndex/bg1.jpg' />" />
				    </c:if>
				</div>
				<div class="col-sm-4">
				    <label>加载进度</label>
                      <div style="width:100px;height: 10px;margin-top:0.5rem; border: 2px solid #afafaf;border-radius:15px;"class="smallParent">
        			    <div style="width:0px;height: 7px;background-color: #afafaf" class="smallProgress"></div>
        		      </div>
					<button type="button" class="btn-info" id="deleteSmallPic" style="padding-left:10px;border-radius:6px; margin-top:1rem">删除图片</button>
                </div>
             </div>
             <div class="col-sm-6 col-sm-push-2">
                      <label>加载进度</label>
                       <div style="width:100px;height: 10px;margin-top:0.5rem; border: 2px solid #afafaf;border-radius:15px;"class="videoParent">
        			     <div style="width:0px;height: 7px;background-color: #afafaf" class="videoProgress"></div>
        		       </div>
                <button type="button" class="btn-info" style="border-radius:6px; margin-top:1rem" id="deleteVideo" >删除视频</button>
             </div>
           </t:formgroup>
           <t:formgroup>
                <t:label path="introduction" cssClass="col-sm-2" />
				<t:input path="introduction"  colClass="col-sm-10" />
        	</t:formgroup>
        	<t:formgroup>
                <t:label path="medioType" cssClass="col-sm-2" />
				<t:selectButton path="medioType"  colClass="col-sm-4" />
        		<t:label path="sort" cssClass="col-sm-2" />
				<t:input path="sort" tsStep="10" touchspin="true" colClass="col-sm-4" tsMax="100000000" />
        	</t:formgroup>
           <t:formgroup>
                <t:label path="content" cssClass="col-sm-2" />
				<t:ueditor toolbarStyle="default" path="content" style="height:150px;" colClass="col-sm-10" />
        	</t:formgroup>
        </t:form>
    </div>
    <div class="navbar-fixed-bottom">
    <t:panelFoot headingBtnCssClass="heading-btn pull-right-important">
		<t:button icon="icon-floppy-disk" onclick="saveData()" cssClass="btn-info" csize="sm">保存</t:button>
	</t:panelFoot>
	</div>
</t:panel>

<script type="text/javascript">
	function saveData(){
		if (!$("form:first").valid()){
			return;
		}
		$("form:first").submit();
	}	
	
	$(function(){
		$("#smallPicShow").on('click',function(e) {
			$(".smallProgress").width(0);
			$("#imgUrl").startCosFileUpload({
				fillImg:"#smallPicShow",
				progressCallback:function(curr, sha1){
					$(".smallParent").show();
					$(".smallProgress").width(0);
					$(".smallProgress").width(sha1*96);
				}
			});
		});
		
		$("#courseVideo").on('click',function(e) {
			$(".videoProgress").width(0);
			$("#videoUrl").startCosFileUpload({
			
				fillName:"#courseVideo",
				progressCallback:function(curr, sha1){
					$(".videoParent").show();
					$(".videoProgress").width(0);
					$(".videoProgress").width(sha1*96);
				}
			
			});
		});
		
		
	});	
	
</script>
<%@ include file="/WEB-INF/views/shared/base/scripts/jqueryui.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formselects.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formstyling.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formselects.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/forminputs.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formpickers.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/ztree.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/editor/ueditor.jsp"%>
<%@ include file="/WEB-INF/views/shared/master/dialog.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/tools/upload-cos.jsp"%>
<%@ include file="/WEB-INF/views/shared/master/contentFooter.jsp"%>
